<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0">
		<link rel="stylesheet" href="../css/style-reset.css">
		<title>胯部柔韧度测试</title>

		<style>
			html,
			body{
				background-color: #fff;
			}
			/* content */
			.content{
				background-color: #fff;
			}
			.content p{
				font-size: 13px;
				color: #42455c;
				padding: 10px 0;
				text-align: center;
				background-color: #f8f8f8;
			}
			/*ul*/
			.content ul{
				background-color: #fff;
				padding: 0 15px;
			}
			.content ul li{
				position: relative;
				height: 130px;
				margin-bottom: 5px;
			}
			.content ul li img{
				display: block;
				width: 100%;
				height: 100%;
				background-size: 100% 100%;
			}
			.content ul li span{
				position: absolute;
				top: 15px;
				right: 15px;
				display: inline-block;
				width: 35px;
				height: 35px;
				border: none;
				border-radius: 50%;
				-webkit-border-radius: 50%;
			}
			.content ul li .select-icon{
				background-image: url(../images/icons/unselect-gesture.png);
				background-size: 100% 100%;
			}
			.content ul li .selected{
				background-image: url(../images/icons/select-gesture.png);
				background-size: 100% 100%;
			}
			/* btn-item */
			.btn-item{
				width: 90%;
				margin: 0 auto;
				margin-top: 20px;
				margin-bottom: 10px;
				overflow: hidden;
			}
			.btn-item a{
				display: inline-block;
				height: 35px;
				width: 40%;
				padding: 0 	10px;
				text-align: center;
				line-height: 35px;
				background-color: #53ceca;
				font-size: 16px;
				font-weight: 600;
				color: #fff;
				border: none;
				border-radius: 4px;
				-webkit-border-radius: 4px;
			}
			a.continue{
				float: left;
			}
			a.next{
				float: right;
			}
		</style>
	</head>
	<body>
		<div class="content">
			<p>盘腿前驱，手臂最远能伸展到哪里呢？</p>
			<ul>
				<li>
					<img src="../images/1.png" alt="">
					<span class="select-icon"></span>
				</li>
				<li>
					<img src="../images/2.png" alt="">
					<span class="select-icon selected"></span>
				</li>
				<li>
					<img src="../images/1.png" alt="">
					<span class="select-icon"></span>
				</li>

			</ul>
			<div class="btn-item">
				<a class="continue" href="">下次继续</a>
				<a class="next" href="">下一步</a>
			</div>
		</div>
	</body>
</html>